/*****************************************************************************
*   MEDIA 768px
******************************************************************************/

@media (min-width: 768px) and (max-width: 979px) {

    .whycipa{
        width: 480px
    }

    ul.address2{
        margin-right: 0
    }

    .sidenav{
        float: none;
        width: 100%;
        margin-bottom: 10px
    }

    .pika-stage,
    .jcarousel-skin-pika{
        display: none
    }

    /*    .content h1,
        .content .hoteladdress
        {padding-left: 0}*/

    .content .holder{
        margin: 5px 0
    }
    .content .details{
        margin-left: 0
    }
    #tabs,
    #accommodation-body #subscribe
    {margin: 0}
    #accommodation-body #subscribe{margin-top: 7px}

    #map_tab .pull-left,
    #map_tab .pull-right{
        float: none
    }
    #map_tab .pull-right{margin-bottom: 10px}

    #filter,
    #search-body .googlemap
    {
        padding-left: 0;
        padding-right: 0;
    }


    .recentlybooked {margin-left: 0}
    footer li{
        font-size: 11px;
        padding: 0 9px;
    }
    ul.address,
    .staticmap,
    /*#filter,*/
    .guestrating
    {display: none}
    ul.general li a {
        display: block;
        font-size: 10px;
        line-height: 16px;
    }
    .box .details {width: 492px;}
    .content .holder div.pull-left:first-child,
    .content .holder div.pull-right:last-child{float: none}

    #search-body #search-body .excursions_box .details {
        width: 483px;
    }

    .cbody .container {
        width: 724px;
    }
    .cbody #payment_insurance,
    .cbody .sec{
        float: none;
        width: 100%
    }
    .cbody .sec{
        margin-top: 23px;
        border-right: 0
    }
    .check .tabdiv .oneborder .persons {
        border-left: 0;
        border-bottom: 1px solid #DADADA;
    }
    .content .details{margin-left: 0}



    #index-body #form,  #banner, .recentlybooked, #search-body .form-holder, #search-body .results-holder, .content .details, 
    .oneborder .form-horizontal .dates, .oneborder .form-horizontal .basic_service , .oneborder .form-horizontal .persons
    {
        height: auto !important;
        width: 100% !important;
    }
    .span4 {
        width: 300px !important;
    }



    .googlemap{margin-top: 10px}
    #search-body .googlemap{margin-top: 5px; padding: 2px 0 10px;}
    .mobile_friendly
    {display: none}
    .recentlyBooked .span1{
        width: 60px !important
    }

    .body .inner{
        padding: 0 0 20px
    }
    .body .inner:first-child{
        padding-top: 13px
    }
    .body #subscribe {
        margin: 0 0;
    }
    footer li{
        background: none
    }
    .specialoffer {
        width: 100%;
    }
    .results-holder h1{padding-left:0}
    .page_navigation{margin-left: 0}
    .box{margin: 1px 0 0}
    .table-holder{margin: 0}
    #search-body #subscribe {
        margin: 23px 0 0 0;
    }
    .content .gallery_img{display: block}

    #index-body #search-body .results-holder h1{
        padding-left: 15px;
    }
    .tags-title, .tags{
        margin-left: 15px !important
    }

    .subscribe_wba .span6{
        float: none;
        width: 440px
    }
    .wba{
        margin: 0 0 20px 0
    }
}

/*****************************************************************************
*   MEDIA 480px
******************************************************************************/
@media (max-width: 767px) {

    .whycipa{
        width: 90%;
        float: none;
        padding: 0 30px;
    }

    .customerservice{
        float: none;
        text-align: center;
        background-position: center bottom;
        margin-top: 30px
    }

    ul.address2{
        margin-right:0;
    }

    ul.whybook{margin-right: 0}

    .sidenav{
        float: none;
        width: 100%;
        margin-bottom: 10px
    }


    /*    .content h1,
        .content .hoteladdress
        {padding-left: 0}*/

    .content .holder{
        margin: 5px 0
    }
    .content .details{
        margin-left: 0
    }
    #tabs,
    #accommodation-body #subscribe
    {margin: 0}
    #accommodation-body #subscribe{margin-top: 7px}

    #map_tab .pull-left,
    #map_tab .pull-right{
        float: none
    }
    #map_tab .pull-right{margin-bottom: 10px}

    .results-holder h1{padding-left:0}
    .page_navigation{margin-left: 0}
    .box{margin: 1px 0 0}
    .table-holder{margin: 0}
    #search-body #subscribe {
        margin: 23px 0 0 0;
    }

    #filter,
    #search-body .googlemap
    {
        padding-left: 0;
        padding-right: 0;
    }

    .recentlybooked{margin-left: 0}
    footer,
    ul.address,
    .mobile_friendly
    {display: none}
    ul.general li{
        float: none;
        border-right: none
    }
    ul.general li a {line-height: 19px}
    #form{height: auto}
    .rslides .info {
        position: absolute;
        right: 0;
        top: 100px;
    }
    .specialoffer h2 {
        font-size: 23px;
    }
    .recentlybooked li {
        border-bottom: none
    }

    .staticmap,
    /*#filter,*/
    /*.box .rating,*/
    .box .small-desc,
    /*.box .show_how_meny_nights,*/
    table.rooms th:nth-child(2),
    /*table.rooms th:nth-child(3),*/
    table.rooms td:nth-child(2),
    /*table.rooms td:nth-child(3),*/
    .pika-stage,
    .jcarousel-skin-pika,
    .guestrating
    {display: none}



    .box .details {float: none; margin-top: 10px; width: 100%}
    .content .gallery_img{display: block}
    .content .holder div.pull-left:first-child,
    .content .holder div.pull-right:last-child,
    .carousel
    {float: none}

    .cbody .container {width: auto}

    .cbody #payment_insurance,
    .cbody .sec{
        float: none;
        width: 100% !important
    }
    .cbody .sec{
        margin-top: 23px;
        border-right: 0
    }
    .cbody #steps{position: relative;margin: -30px 0 13px}
    .cbody #summary ul,
    .cbody #summary img
    {
        float: none;
        margin: 0 0 0 0;
    }
    .cbody #summary img{margin-bottom: 13px}

    .check .hold_booknow {
        float: none;
        margin: 23px 0;
        width: 100%;
    }
    .check .tabdiv .oneborder .persons {
        border-left: 0;
        border-bottom: 1px solid #DADADA;
    }



    #social, .smallsep, #infoline,
    #topnav ul li:first-child,
    #topnav ul li:nth-child(2)
    {display: none}

    #index-body #form,  #banner, .recentlybooked, #search-body .form-holder, #search-body .results-holder, .content .details,
    .oneborder .form-horizontal .dates, .oneborder .form-horizontal .basic_service , .oneborder .form-horizontal .persons,  #information_tab .third,.polices ,.oneborder
    {
        height: auto !important;
        width: 100% !important;
    }
    .span4 {
        width: 300px !important;
    }
    .thumbnails li.span4:nth-child(3), .thumbnails li.span4:nth-child(4) {
        margin-bottom: 20px;
    }
    .body .inner{
        padding: 0 0 20px
    }
    .body .inner:first-child{
        padding-top: 13px
    }
    .body #subscribe {
        margin: 0 0;
    }
    footer li{
        background: none
    }
    .specialoffer {
        width: 100%;
    }
    #subscribe
    {display: none}
    .recentlyBooked .span1{
        width: 60px !important;
        margin-right: 20px
    }
    .recentlyBooked [class*="span"]{
        float: left !important
    }
    .box .details{
        min-height: 90px
    }
    #calendar .ui-datepicker-group{
        float: none
    }
    #calendar .ui-datepicker{width: 16em !important}
    #prices_tab li {
        line-height: 23px;
    }
    #question .col-1,
    #question .col-2,
    #question textarea,
    #question label,
    #question select
    {
        width: 100%;
        min-width:100%;
    }
    #question input[type="text"], #question input[type="email"]{
        width: 100% !important;
    }
    .content .hotel-star {
        margin: 7px 0 7px 15px;
    }
    .content .hotel-star.pull-left,
    .content h1.pull-left{
        float: none
    }
    .col-exc{
        width: 100%;
        float: none
    }
    .col-exc.pad-left{
        margin-left:0
    }

    .subscribe_wba .span6{
        float: none;
        width: 440px
    }
    .wba{
        margin: 0 0 20px 0
    }

    .transfer-banner .span-12,
    .main_content .transfer-banner .span-12{
        width: 90%;
    }

    #index-body #search-body .results-holder h1{
        padding-left: 15px;
    }
    .tags-title, .tags{
        margin-left: 15px !important
    }

    #footer-home .pull-right,
    #footer-home .pull-left{
        float: none;
        margin-left: 30px
    }

    #footer-home .address2{margin-top: 80px}
    #footer-home .whybook{margin-top: 20px; margin-left: 30px}
}

/*****************************************************************************
*   MEDIA 300px
******************************************************************************/
@media (max-width: 480px) {

    #question legend{
        line-height: 26px;
        padding-bottom: 5px
    }

    .col-exc{
        width: 100%;
        float: none
    }
    .col-exc.pad-left{
        margin-left:0
    }


    .main-page .black.black2,
    .body.page  .black.black2{
        bottom: 0;

    }
    .main-page .black.black2 h3{
        font-size: 17px
    }
    .files li span{
        display: none
    }
    .files ul li {
        background-position: 0 12px !important
    }

    .results-holder h1 {
        padding-left: 0;
    }
    .body.page .inner{
        padding: 13px 10px
    }


    footer,
    .mobile_friendly
    {display: none}
    ul.general li{
        float: none;
        border-right: none;
    }
    ul.general li a {line-height: 21px}
    #form{height: auto}

    #information_tab .third {
        height: auto !important;
        width: 100% !important;
    }
    .oneborder .form-horizontal .persons .controls,
    .oneborder .form-horizontal .dates input
    {float: none}

    .oneborder .form-horizontal .controls{margin-left: 0}
    .dates .ui-datepicker-trigger{ left: 135px}

    .cbody .form-horizontal .controls {
        margin-left: 0;
    }
    .cbody .form-horizontal .control-label {
        width: auto
    }
    #footer-home p{display: none}
    #index-body .result-price{display: none}
    .rslides .black{
        padding: 3px 13px 5px 13px
    }
    .inner {
        padding: 0 10px 20px;
    }
    .recentlybooked{margin-left: 0}
    .main_footer_wide{padding-top: 13px}
    .results-holder h1{line-height: 31px}
    dl dt{
        width: 40%
    }
    dl dd {
        width: 57%;
    }
    dl{font-size: 11px}
    dl dd .gray{font-size: 11px}
    .content .details{margin-left: 0}
    .tabnav li a{width: 93%; padding: 7px 10px; border-radius: 0}
    #googlemap{display: none}
    #steps li {
        float: left;
        padding: 8px 20px 0 4px;
        width: 98%;
    }
    .cbody #logo{margin-left: 10px}
    .cbody #header #infoline{width: 96%}
    nav li a{height: auto}






    .form-horizontal .controls,
    .form-horizontal .form-actions,
    .form-horizontal .control-label {
        margin-left: 0;
        padding-left: 0;
        text-align: left
    }
    .what .controls{
        line-height: 23px;
        position: relative
    }
    .what label{
        margin-bottom: 7px
    }
    .form-horizontal .control-group{
        margin-bottom: 10px
    }

    #index-body .result-price,
    .rslides .black p
    {display: none }
    .rslides .black{
        bottom: 0;
        left: 0;
        padding: 3px 13px
    }
    .rslides li .black{width: 100% !important}

    .body .specialoffer h2 {
        border-bottom: 1px solid #DDDEE4;
        font-size: 18px;
    }
    #subscribe,#footer-home p {display: none}

    h2.move-top-20{margin-top: 0 !important}

    .recentlybooked{margin-top: 0}

    .results-holder h1{line-height: 29px}
    .box .show_how_meny_nights,
    .box .rating,
    #search-body .result-price{display: none}

    #search-body .result-price{display: block}

    #search-body #search-body .excursions_box .details{width: 100%}


    #accommodation-body .content .total .booknow{
        float: none;
        margin-top: 10px
    }
    #accommodation-body .content .total b{float: none}
    #accommodation-body table.rooms th:first-child, #accommodation-body table.rooms td:first-child{padding-left: 7px}
    .table-holder a.slika{display: none}
    .content .hotel-star{ margin: 7px 0 7px 15px;}

    #calendar .ui-datepicker-group{
        float: none
    }
    #calendar .ui-datepicker{width: 16em !important}
    #prices_tab li {
        line-height: 23px;
    }
    #payment_method div.half.pull-left:first-child,
    #payment_method div.half.pull-left:last-child{
        width: 100%
    }
    .form-horizontal .home_control_label{
        width: 100%
    }
    .what .home_control_label{
        padding-top: 0
    }

    #search-body #search-body .result-price .from{
        display: none
    }
}

/*****************************************************************************
*   MEDIA  580px, 320px -- Main Navigation
******************************************************************************/
@media only screen and (max-width : 979px),
only screen and (max-device-width : 979px){
    nav ul{ height: auto}
    /*    nav>ul>li {
            border-left:none;
            border-right: 1px solid #FFF;
            width: 25%;
            border-bottom: 1px solid #fff;
            padding: 0;
            background: transparent
        }*/
    nav li a{
        font: 400 14px/1 'Lato',sans-serif;
        background: #414141
    }
    nav>ul>li>ul{
        width: 100%
    }
    /*    nav li:last-child a, nav li:nth-child(4) a {
            border-right: none;
        }*/
    /*    nav li:nth-child(5) a, nav li:nth-child(6) a, nav li:nth-child(7) a, nav li:nth-child(8) a {
            border-bottom: none;
        }*/
    nav>ul>li:first-child{
        display: none
    }
    nav li:first-child span:last-child{
        display: block
    }
}
@media only screen and (max-width : 730px),
only screen and (max-device-width : 730px){
    nav>ul>li {
        width: 50%;
        font: 400 12px/1.4 'Lato',sans-serif;
        padding: 0;
    }
    nav li:nth-child(even) a {
        border-right: none;
    }
    .body_ru nav small{
        font-size: 10px
    }

    nav>ul>li>ul{
        width: 100%
    }
}
@media only screen and (max-width : 380px),
only screen and (max-device-width : 380px){
    .body_ru nav small,
    .body_me nav small{
        font-size: 8px;
    }
    .sf-arrows .sf-with-ul:after{
        right: 5px;
    }
}
@media only screen and (max-width : 319px),
only screen and (max-device-width : 319px){
    nav li a {
        padding: 10px;
        font: 400 11px/1.4 'Lato',sans-serif;
    }
    nav li:first-child a,
    nav li:last-child a{padding: 10px}
    .specialoffer h2{
        line-height: 23px;
        padding-bottom: 5px
    }

    .sf-arrows .sf-with-ul {
        padding-right: 0;
    }
    .sf-arrows .sf-with-ul:after{
        right: 7px;
        top: 19px;
    }
} 